<template>
    <div class="detail">
        <div>Detail</div>
        <div>{{ detailCount }}</div>
    </div>
</template>

<script>
import detailStoreModule from '../store/modules/detail'
export default {
  name: 'Detail',

  asyncData ({ store }) {
    store.registerModule('detail', detailStoreModule)
    return store.dispatch('detail/inc')
  },
  // 重要信息：当多次访问路由时，
  // 避免在客户端重复注册模块。
  destroyed () {
    this.$store.unregisterModule('detail')
  },
  computed: {
    detailCount () {
      return this.$store.state.detail.count
    }
  }
}
</script>
